<template>
    <view class="body">
        <view class="welcome-text">
            亲爱的小叶子，别忘了完成下面的<span style="color: #f9b96f;">任务</span>
            赢取积分哦！积分多多，皮肤和商品等你来兑换！
        </view>
        <view>
            <image src="/static/人物形象初始化.png" class="people-img" />
        </view>
        <image src="/static/积分.png" class="score-background" />
        
    </view>
    <view class="news">
        <image src="/static/喜迎2025.png" class="news-img" />
        <image src="/static/通知人物.png" class="news-people" />
    </view>
    <view class="news" style="left: 290px;">
        <image src="/static/助学.png" class="news-img" />
    </view>
    <view class="task">开学前任务</view>
    <view class="taskDiv">

    </view>
    <view class="taskDiv">
        <view class="taskList">
            <radio-group @change="changeInformation">
                <label>
                    <radio :value="information" :checked="information" />
                </label>
            </radio-group>信息采集
            <view style="margin-left: 150px;" v-show="information === false">
                <span>0</span>
                <span style="color: gray;">/3</span>
            </view>
            <view style="margin-left: 150px;" v-show="information === true">
                <span>3</span>
                <span style="color: gray;">/3</span>
            </view>

        </view>

        <view class="taskList" style="margin-top: 90px;">
            <radio-group @change="changeknow">
                <label>
                    <radio :value="know" :checked="know" />
                </label>
            </radio-group>开学须知
            <view style="margin-left: 150px;" v-show="know === false">
                <span>0</span>
                <span style="color: gray;">/2</span>
            </view>
            <view style="margin-left: 150px;" v-show="know === true">
                <span>2</span>
                <span style="color: gray;">/2</span>
            </view>

        </view>


        <view class="taskList" style="margin-top: 50px;">
            <radio-group @change="changeProducts">
                <label>
                    <radio :value="products" :checked="products" />
                </label>
            </radio-group>生活用品
            <view style="margin-left: 150px;" v-show="products === false">
                <span>0</span>
                <span style="color: gray;">/2</span>
            </view>
            <view style="margin-left: 150px;" v-show="products === true">
                <span>2</span>
                <span style="color: gray;">/2</span>
            </view>

        </view>
    </view>
    <view class="nav-bar">
      <view class="nav-div">
        <image src="/static/地图导航.png" class="nav-img" @click="toChat" />
<view class="nav-title">校园导航</view>
      </view>
      <view class="nav-div" style="margin-left: 120px;" >
        <image src="/static/小易解答.png" class="nav-img" @click="toChat"/>
<view class="nav-title">小易解答</view>
      </view>
    </view>
<view class="home-nav">
    <image
        src="/static/导航栏.png" class="home-navImg"/>
</view>

</template>
<script setup lang="ts">
import { welcomeData } from './welcome';
const { newsImgs, know, information, products,
    changeInformation, changeknow, changeProducts, toChat} = welcomeData();
</script>
<style lang="scss" scoped>
@import './welcome.scss'
</style>

<!-- // <view class="image-slider">
//     <swiper class="swiper" :indicator-dots="false">
//       <swiper-item v-for="(image, index) in newsImgs" :key="index">
//         <image :src="image" class="image"></image>
//       </swiper-item>
//     </swiper>
//   </view> -->
